Android  웹 뷰 와 js 상호 호출 실현 방법

Android-webview 와 js 가 서로 호출 됩 니 다.
안 드 로 이 드 와 H5 는 모두 모 바 일 개발 애플 리 케 이 션 이 매우 광범 위 하 다.시장 에서 많은 앱 들 이 안 드 로 이 드 를 이용 하여 개발 되 었 지만 안 드 로 이 드 를 이용 하여 비교적 복잡 한 부속 류 를 개발 하고 제시 적 인 페이지 는 얻 는 것 보다 잃 는 것 이 많다.한편,H5 는 개발 속도 가 빠 르 기 때문에 업 데 이 트 는 App 의 업데이트 에 의존 하지 않 고 서버 에서 해당 하 는 페이지 만 업데이트 하면 되 기 때문에 App 과 H5 페이지 의 결합 이 특히 중요 하 다.한편,안 드 로 이 드 와 H5 는 매번 독립 적 으로 존재 하 는 것 이 아니 라 서로 영향 을 주 고 호출 하 며 정 보 를 얻 는 등 이다.예 를 들 어 H5 페이지 는 App 에 있 는 사용자 의 기본 정 보 를 얻 거나 App 에서 H5 페이지 를 조작 해 야 하 는 등 두 가지 가 어떻게 상호작용 하 는 지 살 펴 보 자.
프로젝트 의 전체적인 구 조 를 살 펴 보 겠 습 니 다.(Android studio 의 프로젝트)

전체 프로젝트 의 구 조 는 바로 이렇다.그 중에서 가장 중요 한 것 은 assets 아래 의 js 이다.웹 뷰.html 파일 과 코드 에 있 는 웹 뷰 Js Activity 입 니 다.그 중에서 프로젝트 에 있 는 MainActivity 는 점프 만 했 을 뿐 웹 뷰 Js Activity 로 넘 어 갑 니 다.이렇게.
아래 코드:(jswebView.html)

html 안의 코드 도 비교적 간단 합 니 다.전체 html 에 하나의 Button 만 있 습 니 다.이 Button 을 클릭 할 때 자바 script 중의 jsCallAndroid()방법 을 실행 합 니 다.
웹 페이지 에서 자바 script 에 관 한 코드 도 비교적 간단 합 니 다.전체 js 는 두 가지 방법 입 니 다.하 나 는 jsCallAndroid()이 고 하 나 는 androidCallJs()입 니 다.방법 명 을 보면 알 수 있 듯 이 각각 js 가 안 드 로 이 드 를 호출 한 것 과 안 드 로 이 드 가 js 를 호출 한 것 이다.
일단 상관 하지 마. jsCallAndroid()에서 하 는 게 뭐 예요?이따가 설명 할 게 요. androidCallJs()이 방법 에서 하 는 것 은 바로 정보 알림 상자 가 팝 업 되 는 것 입 니 다.구체 적 인 힌트 는 어떤 정보 도 중요 하지 않 습 니 다.마음대로 하 세 요.
코드 부분 다시 보기(WebView Activity 의 레이아웃 파일): 

전체 레이아웃 파일 도 간단 합 니 다.하나의 단추 와 하나의 WebView,단 추 는 안 드 로 이 드 가 js 를 호출 하 는 것 을 테스트 하 는 데 사 용 됩 니 다.js 가 안 드 로 이 드 를 호출 하면 당연히 webview 가 불 러 온 웹 페이지 의 단추 입 니 다.
자바 코드 부분 다시 보기(WebView Activity):

다음은 코드 부분 을 살 펴 보 겠 습 니 다.
37-42 줄:이 몇 줄 은 안 드 로 이 드 버튼 의 클릭 이벤트 입 니 다.설명 할 것 이 없습니다.클릭 이벤트 가 무엇 을 하 는 지 볼 까요?이 벤트 를 클릭 하면 웹 뷰 의 loadurl 방법 으로 js 의 방법 을 호출 합 니 다.호출 방식 은 다음 과 같 습 니 다.앞 에는 자바 script 중간 용 입 니 다.마지막 으로 호출 할 js 방법 명 을 구분 합 니 다.
45-55 줄:이 몇 줄 은 Webview 에 대한 설정 등 이 있 습 니 다.46-51 이 몇 줄 은 팝 업 창,즉 html 페이지 탄 상 자 를 지원 하 는 것 을 말 합 니 다.앞의 html 코드 에 우리 Android 가 js 를 호출 할 때 호출 에 성공 하면 js 팝 업 창 이 있 기 때문에 여기에 이 설정 을 추가 해 야 합 니 다.다음은 53 줄,53 줄 은 자바 script 을 지원 하 는 것 을 말 합 니 다.html 의 자바 script 해석 을 지원 하 는 것 을 말 합 니 다.js 와 Android 의 상호작용 이 든 웹 페이지 에 js 가 포함 되 어 있 으 면 모두 필요 합 니 다.가장 관건 적 인 것 은 54 줄 입 니 다.54 줄 은 자바 script 과 Android 가 상호작용 을 하 는 것 입 니 다.add자바 script Interface 방법 은 두 개의 인 자 를 받 아들 여야 합 니 다.첫 번 째 는 이에 대응 하 는 js 가 안 드 로 이 드 로 컬 클래스 를 호출 하 는 대상 입 니 다.이 예 는 58-63 줄 과 같은 대상 입 니 다.두 번 째 매개 변 수 는 바로 앞 페이지 의 js 코드 중의 jsCallAndroid 방법 중의 wv.sayHello()입 니 다.여기 의 wv 는 이 매개 변수(wv)와 대응 되 고 sayHello()는 대응 하 는 첫 번 째 매개 변수의 대상 안의 방법 입 니 다.
마지막 으로 58-63 줄 입 니 다.이 몇 줄 은 설명 할 것 이 없습니다.호출 에 성공 하면 로 그 를 인쇄 합 니 다.호출 이 성 공 했 는 지 확인 하 는 것 뿐 입 니 다.
데모 코드 전체 가 여기 서 끝 났 습 니 다.흥분 되 네요.빨리 실행 해 보 세 요.
실행 결 과 는 많은 사람들 을 실망 시 킬 것 입 니 다.안 드 로 이 드 가 js 를 호출 하 는 데 성 공 했 지만 js 가 안 드 로 이 드 를 호출 하 는 데 성공 하지 못 했 습 니 다. 
왜 그 럴 까요?여기 서 언급 해 야 할 것 은 웹 뷰 와 js 의 안전성 에 관 한 문제 이다.js 는 이러한 방식 으로 악성 코드 를 다운로드 하여 안 드 로 이 드 에서 실행 할 수 있 습 니 다.구체 적 으로 관심 이 있 는 것 은 구 글 에 가 볼 수 있 습 니 다.그래서 위의 방법 은 Api 16 이전의 안 드 로 이 드 핸드폰 에 만 적 용 됩 니 다.16 이후 구 글 은 이 안전성 문 제 를 복 구 했 습 니 다.안 드 로 이 드 가 가지 고 있 는 자바 script Interfface 클래스 에 주석 을 달 아 줍 니 다.다음은 16 이후 의 작법 이 어떤 지 볼 까요?

 주해 가 있 으 니 그야말로 호랑이 에 게 날 개 를 달 아 주 는 것 같 아서 매우 편리 하 다.아니면 원래 의 레 시 피,아니면 원래 의 맛,원래 의 맛.Activity 의 코드 를 수정 해 야 하 는 것 외 에는 움 직 이지 않 습 니 다.
변 경 된 코드 는 55 줄 입 니 다.this(Context)대상 을 직접 전달 하면 됩 니 다.그러면 원래 의 JSInterface 는 필요 하지 않 습 니 다.아니요.그럼 제 가 say Hello 방법 을 어디 까지 쓸 까요?당신 이 전달 한 것 이 this 이 니 당연히 this 에 쓰 세 요(59-62 줄).다른 것 은 이 sayHello()방법 에 자바 script Interface 의 주 해 를 추가 해 야 한 다 는 것 이다.
OK,16 이전 과 16 이후 의 것 이 모두 있 으 면 OK 가 되 지 않 습 니까?자 바스 크 립 트 를 추가 할 때 Api 버 전 을 판단 해 주시 면 됩 니 다.하하...
아니 야,아니 야,틀림없이 이렇게 하지 않 을 거 야.onCreate()방법 에 추가 해 야 함 @SuppressLint("JavascriptInterface")주석 을 달 면 됩 니 다.
아래 를 보면 최종 코드 입 니 다.
 
그래,그래,바로 이렇다.큰 성 과 를 거두다.
마지막 으로 언급 해 야 할 것 은 위의 예 는 실행 할 수 있 고 정상 적 인 상황 에서 문제 가 없 지만 인터넷 의 demo 를 보 세 요.안 드 로 이 드 가 js 를 호출 할 때 키 스 레 드 를 열 어 호출 하 는 경우 가 많 습 니 다.맞아요.실제 개발 에서 반드시 이렇게 해 야 합 니 다.좋 은 점 은 말 하지 않 아 도 안다.이 점 은 마지막 코드 그림 을 보면 웹 뷰 를 직접 호출 하 는 post 도 있 습 니 다.안 에는 안 드 로 이 드 가 js 를 호출 하 는 것 입 니 다.

좋은 웹페이지 즐겨찾기